<template>
  <div>
    <div class="seed_top_banner">
      <div class="seed_back_arrow" @click="back">
        <svg class="icon" aria-hidden="true">
          <use xlink:href="#icon-zuo"></use>
        </svg>
      </div>
      <div class="seed_page_title"><span>物流管理</span></div>
      <div class="seed_page_tool"></div>
    </div>
    <div class="seed_logis_body">
      <div class="seed_logis_head">
        <div class="seed_logis_head_l">
          <img v-bind:src="website + '/' +info.extend_order_goods[0].goods_image" @load="successLoadImg" @error="errorLoadImg">
        </div>
        <div class="seed_logis_head_r">
          <h2>{{info.extend_order_goods[0].goods_name}}</h2>
          <div>共{{count}}件商品</div>
          <h3>{{info.e_name}}: {{info.extend_order_common.shipping_sn}}</h3>
        </div>
      </div>
      <div class="seed_logis_centre">
        <div class="seed_logis_middle">
          <div class="seed_logis_middle_l">
            <img src="@/assets/images/dw.png">
          </div>
          <div class="seed_logis_middle_r">
            <span>{{info.receiver_info.address}}</span>
            <div><u>{{info.extend_order_common.receiver_name}}</u><i>{{info.receiver_info.mobile}}</i></div>
          </div>
        </div>
      </div>
      <div class="seed_logis_bottom">
        <div class="seed_logis_bottom_box" v-for="(item, index) in exp" v-bind:key="index">
          <div class="seed_logis_bottom_box_l">
              <span>{{item.time}}</span>
              <i>{{item.date}}</i>
          </div>
          <div class="seed_logis_bottom_box_r">
              <span>{{item.AcceptStation}}</span>
          </div>
        </div>
      </div>
    </div>
  </div>
</template>
<script>
export default {
  data () {
    return {
      id: 0,
      tab: 0,
      info: [{receiver_info: {}, extend_order_common: {}}],
      exp: [],
      website: '',
      count: 0
    }
  },
  created () {
    this.id = this.$route.params.id
    this.tab = this.$route.params.tab
    this.getExpInfo()
    this.getDetail()
  },
  methods: {
    back () {
      if (this.$route.params.tab) {
        this.$router.push({name: 'order-list', params: {tab: this.$route.params.tab}})
      } else {
        this.$router.push({name: 'order-detail', params: {id: this.$route.params.id, tab: this.$route.params.d_tab}})
      }
    },
    getExpInfo () {
      this.$request.ExpInfo({order_id: this.id}).then(data => {
        this.exp = data
      })
    },
    getDetail () {
      this.$request.orderInfo(this.id).then(data => {
        this.info = data.order_info
        this.website = data.website
        this.count = data.order_info.extend_order_goods.length
      })
    }
  }
}
</script>
